<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
	<title>常见的技术产品官网</title>
	<link rel="stylesheet" href="./style.css">
</head>
<body>
	<div class="main">
	<!-- 头部 -->
		<header>
			<div class="logo"><img src="images/1.png" alt="logo" style="vertical-align:middle;"><span style="margin-left: 10px;">新世界</span></div>
			<nav>
				<ul class="nav">
					<li><a href=""></a><img src="images/2.png" alt="login" style="vertical-align:middle;margin-top: -4px;">登录</li>
					<li><a href=""></a>关于我们</li>
					<li><a href=""></a>爱心社区</li>
					<li><a href=""></a>项目介绍</li>
					<li><a href=""></a>最新活动</li>
					<li class="show"><a href=""></a>首页</li>
				</ul>
			</nav>
		</header>
		<article>
			<!-- 正文一 -->
			<div style="position: relative;">
				<img src="images/3.png" alt="图一">
				<div class="mid"></div>
				<div class="midtext">
					<p style="font-size: 60px;">Time of new life</p>
					<p style="font-size: 21px;margin-top: 30px;">新时代，年轻的人们让我们一起<br>  体验新生活，享受新生活</p>
					<div>开始体验</div>
				</div>
			</div>
			<!-- 正文二 -->
			<div class="middiv">
				<div>
					<img src="images/4.png" alt="img">
					<p>打造全新世界观，让你更<br>爱你的生活</p>
				</div>
				<div>
					<img src="images/5.png" alt="img">
					<p>丰富多彩的公益活动，发<br>挥新世界的主人公意识</p>
				</div>
				<div>
					<img src="images/6.png" alt="img">
					<p>时尚的新理念，超前体验<br>未知的生活</p>
				</div>
				<div>
					<img src="images/7.png" alt="img">
					<p style="border:none;">完善的培养机制，培养你<br>全新的世界观</p>
				</div>
			</div>
			<!-- 正文三 -->
			<div class="pic">
				<img src="images/8.gif" alt="书籍">
				<p>关于新世界，你不知道的还有什么？</p>
			</div>
			<!-- 正文四 -->
			<div class="addrss">
				<img src="images/9.png" alt="地图背景">
				<div class="mask"></div>
				<div class="text">
					<div class="txt">
						<p style="font-size: 21px;padding-bottom: 10px;">查找新世界城市活动信息</p>
						<span></span>
						<p style="font-size: 12px;">每个城市的有不同的活动信息，请自主查询您所需要了解的城市</p>
					</div>
					<!-- 下拉菜单 -->
					<div class="selects">

						<div class="select">
						<button class="button">中国</button>
							<div class="button_hover">
								<a href="#"></a>
								<a href="#"></a>
								<a href="#"></a>
								<a href="#"></a>
								<a href="#"></a>
								<a href="#"></a>
							</div>
						</div>
						<div class="select">
						<button class="button">省份</button>
							<div class="button_hover">
								<!-- <a href="#">北京市</a>
								<a href="#">天津市</a>
								<a href="#">河北省</a>
								<a href="#">陕西省</a>
								<a href="#">内蒙古自治区</a>
								<a href="#">辽宁省</a> -->
							</div>
						</div>
						<div class="select">
						<button class="button">城市</button>
							<div class="button_hover">
								<a href="#"></a>
								<a href="#"></a>
								<a href="#"></a>
								<a href="#"></a>
								<a href="#"></a>
								<a href="#"></a>
							</div>
						</div>
						<div class="search">搜&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;索</div>
					</div>
				</div>
			</div>
			<!-- 正文五 -->
			<div class="section-5">
				<div style="margin-left: 98px;"><img src="images/11.png" alt="">
					<h4>北京活动
						<h5>新社区大联盟</h5>
					</h4>
				</div>
				<div>
					<h4>深圳活动
						<h5>新社区大联盟</h5>
					</h4>
				<img src="images/12.png" alt=""></div>
				<div><img src="images/13.png" alt="">
					<h4>香港活动
							<h5>奢侈消费大派送</h5>
					</h4>
				</div>
				<div><img src="images/14.png" alt="">
					<h4>上海活动
						<h5>夜上海新景观探索</h5>
					</h4>
				</div>
			</div>




		</article>
		<!-- 固定导航栏 -->
		<div class="course-fixed-x">
			<div class="course-fixed">
				<a href="" class="goto_top_diaocha"></a>
				<a href="" class="goto_top_app"></a>
				<a href="" class="goto_top_feed"></a>
			</div>
		</div>
	</div>
<script src="./main.js"></script>
</body>
</html>